<!DOCTYPE html>
<!--[if IE 7]><html class="ie ie7" lang="en-US"><![endif]-->
<!--[if IE 8]><html class="ie ie8" lang="en-US"><![endif]-->
<!--[if !(IE 7) | !(IE 8)  ]><!--><html lang="en-US"><!--<![endif]-->
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Large Cikonss | Pure CSS Responsive Icons</title>
	<link rel="profile" href="http://gmpg.org/xfn/11" />
	<!-- Styles -->
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oswald:400,700,300">
	<link rel="stylesheet" href="assets/css/normalize.css" />
	<link rel="stylesheet" href="assets/css/fonts.css"/>
	<link rel="stylesheet" href="cikonss.css" />
	<link rel="stylesheet" href="assets/css/demo.css"/>
	<!-- Scripts -->
	<!--[if lt IE 9]>
	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
	<![endif]-->
	<script type="text/javascript" src="assets/js/modernizr-2.6.2-respond-1.1.0.min.js"></script>
	<script src="//use.edgefonts.net/pt-sans-narrow.js"></script>
</head>
<body class="large-icons">

	<div class="top-bar">
		<nav>
			<ul class="navigation">
				<li class="menu-item item-first"><a href="index.html"><span class="icon icon-small"><span class="icon-menu"></span></span>Cikonss</a></li>
				<li class="menu">
					<ul>
						<li class="menu-item"><a href="index.html#preview">Preview</a></li>
						<li class="menu-item"><a href="index.html#usage">Usage</a></li>
						<li class="menu-item"><a href="index.html#examples">Examples</a></li>
						<li class="menu-item"><a href="index.html#about">About</a></li>
					</ul>
				</li>
			</ul><!-- .navigation -->
		</nav>

		<ul class="social-links">
			<li class="item-first"><a href="#"><span aria-hidden="true" class="icon-link"></span></a></li>
			<li class="menu">
				<ul>
					<li class="social-item"><a href="http://twitter.com/zzap_m" target="_blank"><span aria-hidden="true" class="icon-twitter"></span></a></li>
					<li class="social-item"><a href="http://plus.google.com/u/0/105153442065975119656/posts" target="_blank"><span aria-hidden="true" class="icon-google-plus"></span></a></li>
					<li class="social-item"><a href="http://github.com/zzap" target="_blank"><span aria-hidden="true" class="icon-github"></span></a></li>
					<li class="social-item"><a href="http://www.facebook.com/zzapwebdesign" target="_blank"><span aria-hidden="true" class="icon-facebook"></span></a></li>
				</ul>
			</li>
		</ul><!-- .social-links -->
	</div><!-- .top-bar -->

	<header id="header" class="wrapper header-wrap">
		<div class="hgroup">
			<h1 class="title">Cikonss 1.0</h1>
			<h2 class="desc">Pure CSS Responsive Icons - IE friendly</h2>
		</div><!-- .hgroup -->
	</header><!-- #header.wrapper.header-wrap -->

	<div id="content" class="wrapper content-wrap">
		<h1 class="page-title">Large Cikonss</h1>

		<div id="large-default" class="section section-default">
			<h2 class="section-title">Default</h2>
			<div class="icons-list">
				<span class="icon icon-large"><span class="icon-home"></span></span>
				<span class="icon icon-large"><span class="icon-arrowRight"></span></span>
				<span class="icon icon-large"><span class="icon-arrowLeft"></span></span>
				<span class="icon icon-large"><span class="icon-arrowDown"></span></span>
				<span class="icon icon-large"><span class="icon-arrowUp"></span></span>
				<span class="icon icon-large"><span class="icon-comment"></span></span>
				<span class="icon icon-large"><span class="icon-comment-text"></span></span>
				<span class="icon icon-large"><span class="icon-mail"></span></span>
				<span class="icon icon-large"><span class="icon-calendar"></span></span>
				<span class="icon icon-large"><span class="icon-plus"></span></span>
				<span class="icon icon-large"><span class="icon-minus"></span></span>
				<span class="icon icon-large"><span class="icon-file"></span></span>
				<span class="icon icon-large"><span class="icon-folder"></span></span>
				<span class="icon icon-large"><span class="icon-tag"></span></span>
				<span class="icon icon-large"><span class="icon-desktop"></span></span>
				<span class="icon icon-large"><span class="icon-tablet"></span></span>
				<span class="icon icon-large"><span class="icon-phone"></span></span>
				<span class="icon icon-large"><span class="icon-menu"></span></span>
				<span class="icon icon-large"><span class="icon-download"></span></span>
				<span class="icon icon-large"><span class="icon-upload"></span></span>
				<span class="icon icon-large"><span class="icon-tpl-full"></span></span>
				<span class="icon icon-large"><span class="icon-tpl-side-r"></span></span>
				<span class="icon icon-large"><span class="icon-tpl-side-l"></span></span>
				<span class="icon icon-large"><span class="icon-list-view"></span></span>
				<span class="icon icon-large"><span class="icon-grid-view"></span></span>
				<span class="icon icon-large"><span class="icon-camera"></span></span>
				<span class="icon icon-large"><span class="icon-image"></span></span>
				<span class="icon icon-large"><span class="icon-play"></span></span>
				<span class="icon icon-large"><span class="icon-stop"></span></span>
				<span class="icon icon-large"><span class="icon-pause"></span></span>
				<span class="icon icon-large"><span class="icon-forward"></span></span>
				<span class="icon icon-large"><span class="icon-next"></span></span>
				<span class="icon icon-large"><span class="icon-rewind"></span></span>
				<span class="icon icon-large"><span class="icon-prev"></span></span>
				<span class="icon icon-large"><span class="icon-stats"></span></span>
				<span class="icon icon-large"><span class="icon-battery-empty"></span></span>
				<span class="icon icon-large"><span class="icon-battery-1_4"></span></span>
				<span class="icon icon-large"><span class="icon-battery-half"></span></span>
				<span class="icon icon-large"><span class="icon-battery-3_4"></span></span>
				<span class="icon icon-large"><span class="icon-battery-full"></span></span>
				<span class="icon icon-large"><span class="icon-sound-mute"></span></span>
				<span class="icon icon-large"><span class="icon-sound-normal"></span></span>
				<span class="icon icon-large"><span class="icon-sound-loud"></span></span>
			</div><!-- .icons-list -->
		</div><!-- #large-default.section.section-default -->

		<div id="large-squares" class="section section-squares">
			<h2 class="section-title">Squares</h2>
			<div class="icons-list">
				<span class="icon icon-large icon-square"><span class="icon-home"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-arrowRight"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-arrowLeft"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-arrowDown"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-arrowUp"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-comment"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-comment-text"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-mail"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-calendar"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-plus"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-minus"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-file"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-folder"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-tag"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-desktop"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-tablet"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-phone"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-menu"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-download"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-upload"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-tpl-full"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-tpl-side-r"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-tpl-side-l"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-list-view"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-grid-view"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-camera"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-image"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-play"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-stop"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-pause"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-forward"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-next"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-rewind"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-prev"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-stats"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-battery-empty"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-battery-1_4"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-battery-half"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-battery-3_4"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-battery-full"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-sound-mute"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-sound-normal"></span></span>
				<span class="icon icon-large icon-square"><span class="icon-sound-loud"></span></span>
			</div><!-- .icons-list -->
		</div><!-- #large-squares.section.section-squares -->

		<div id="large-rounded" class="section section-rounded">
			<h2 class="section-title">Rounded*</h2>
			<div class="icons-list">
				<span class="icon icon-large icon-rounded"><span class="icon-home"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-arrowRight"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-arrowLeft"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-arrowDown"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-arrowUp"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-comment"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-comment-text"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-mail"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-calendar"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-plus"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-minus"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-file"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-folder"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-tag"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-desktop"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-tablet"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-phone"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-menu"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-download"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-upload"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-tpl-full"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-tpl-side-r"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-tpl-side-l"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-list-view"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-grid-view"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-camera"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-image"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-play"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-stop"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-pause"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-forward"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-next"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-rewind"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-prev"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-stats"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-battery-empty"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-battery-1_4"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-battery-half"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-battery-3_4"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-battery-full"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-sound-mute"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-sound-normal"></span></span>
				<span class="icon icon-large icon-rounded"><span class="icon-sound-loud"></span></span>
			</div><!-- .icons-list -->
			<div class="footnote">* requires border-radius support.</div>
		</div><!-- #large-rounded.section.section-rounded -->

		<div class="section pagination">
			<div class="prev-page">
				<a href="mid-icons.html" title="View Mid Cikonss"><span class="icon icon-pagination"><span class="icon-arrowLeft"></span></span>Mid Cikonss</a>
			</div><!-- .prev-page -->
			<div class="next-page">
				<a href="extra-large-icons.html" title="View Extra Large Cikonss"><span class="icon icon-pagination"><span class="icon-arrowRight"></span></span>Extra Large Cikonss</a>
			</div><!-- .next-page -->
		</div><!-- .section.pagination -->

		<div id="action" class="section section-action">
			<div class="download">
				<span class="icon icon-small"><span class="icon-download"></span></span>
				<a href="https://github.com/zzap/Cikonss/archive/master.zip" title="Download Cikonss 1.0">Download</a>
			</div><!-- .download -->
			<div class="view-on-github">
				<a href="https://github.com/zzap/Cikonss" title="View project on GitHub"><span aria-hidden="true" class="icon-github"></span>View on GitHub</a>
			</div><!-- .view-on-github -->
		</div><!-- #action.section.section-action -->
	</div><!-- #content.wrapper.content-wrap -->

	<footer id="footer" class="wrapper footer-wrap">
		<div id="colophon" class="section section-colophon">
			<p>&copy; 2013 Crafted with love for open source community</p>
		</div>
	</footer><!-- #footer.wrapper.footer-wrap -->

	<!-- Scripts -->
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script type="text/javascript" src="assets/js/demo.js"></script>
</body>
</html>